import { defineStore } from 'pinia'
import { ref, watch } from 'vue'

export const useLanguageStore = defineStore('language', () => {
  // 从localStorage加载语言设置，默认为英文
  const isChinese = ref(localStorage.getItem('AppoxJsTest.Language') === 'zh')

  // 监听语言变化，更新localStorage和DOM
  watch(isChinese, (newValue) => {
    localStorage.setItem('AppoxJsTest.Language', newValue ? 'zh' : 'en')
    // 更新DOM中的语言显示
    document.querySelectorAll('[lang="zh"]').forEach(el => {
      el.style.display = newValue ? 'block' : 'none'
    })
    document.querySelectorAll('[lang="en"]').forEach(el => {
      el.style.display = newValue ? 'none' : 'block'
    })
  }, { immediate: true })

  // 设置语言
  function setLanguage(lang) {
    isChinese.value = lang === 'zh'
  }

  return {
    isChinese,
    setLanguage
  }
}) 